﻿(function () {
    "use strict";

    var app = WinJS.Application;

    app.onactivated = function (eventObject) {

        if (eventObject.detail.kind === Windows.ApplicationModel.Activation.ActivationKind.launch) {
            var isReady = false;
            var turn = -1;
            var side = 1;

            //Initialize local app storage access
            var applicationData = Windows.Storage.ApplicationData.current;
            var localSettings = applicationData.localSettings;

            //Load local app storage content
            var value = localSettings.values["flashCardsSettings"];

            if (!value) {
                // No data. Loading my old German Flash Cards
                var flashCards = new Windows.Storage.ApplicationDataCompositeValue();
                flashCards["Q0"] = "Man sieht sich!";
                flashCards["Q1"] = "Sich an die Arbeit machen";
                flashCards["Q2"] = "Kita";
                flashCards["Q3"] = "Fahrschule";
                flashCards["Q4"] = "Anmieten";
                flashCards["Q5"] = "Stromversorgung";
                flashCards["Q6"] = "Hinaufsteigen";
                flashCards["Q7"] = "Nicht der Rede wert";
                flashCards["Q8"] = "Weckruf";
                flashCards["Q9"] = "Auto";
                flashCards["A0"] = "See you!, Bye!";
                flashCards["A1"] = "To sit down to work, to start working";
                flashCards["A2"] = "Daycare Center";
                flashCards["A3"] = "Driving School";
                flashCards["A4"] = "To rent, to hire";
                flashCards["A5"] = "Power Supply";
                flashCards["A6"] = "To climb up, to ascend";
                flashCards["A7"] = "Not worth mentioning";
                flashCards["A8"] = "Wake-up call";
                flashCards["A9"] = "Car";
                localSettings.values["flashCardsSettings"] = flashCards;

                document.getElementById("Question0").value = flashCards["Q0"];
                document.getElementById("Question1").value = flashCards["Q1"];
                document.getElementById("Question2").value = flashCards["Q2"];
                document.getElementById("Question3").value = flashCards["Q3"];
                document.getElementById("Question4").value = flashCards["Q4"];
                document.getElementById("Question5").value = flashCards["Q5"];
                document.getElementById("Question6").value = flashCards["Q6"];
                document.getElementById("Question7").value = flashCards["Q7"];
                document.getElementById("Question8").value = flashCards["Q8"];
                document.getElementById("Question9").value = flashCards["Q9"];
                document.getElementById("Answer0").value = flashCards["A0"];
                document.getElementById("Answer1").value = flashCards["A1"];
                document.getElementById("Answer2").value = flashCards["A2"];
                document.getElementById("Answer3").value = flashCards["A3"];
                document.getElementById("Answer4").value = flashCards["A4"];
                document.getElementById("Answer5").value = flashCards["A5"];
                document.getElementById("Answer6").value = flashCards["A6"];
                document.getElementById("Answer7").value = flashCards["A7"];
                document.getElementById("Answer8").value = flashCards["A8"];
                document.getElementById("Answer9").value = flashCards["A9"];

                isReady = true;
            }
            else {
                // Load Flash Cards
                var flashCards = new Windows.Storage.ApplicationDataCompositeValue();
                flashCards = localSettings.values["flashCardsSettings"];

                document.getElementById("Question0").value = flashCards["Q0"];
                document.getElementById("Question1").value = flashCards["Q1"];
                document.getElementById("Question2").value = flashCards["Q2"];
                document.getElementById("Question3").value = flashCards["Q3"];
                document.getElementById("Question4").value = flashCards["Q4"];
                document.getElementById("Question5").value = flashCards["Q5"];
                document.getElementById("Question6").value = flashCards["Q6"];
                document.getElementById("Question7").value = flashCards["Q7"];
                document.getElementById("Question8").value = flashCards["Q8"];
                document.getElementById("Question9").value = flashCards["Q9"];
                document.getElementById("Answer0").value = flashCards["A0"];
                document.getElementById("Answer1").value = flashCards["A1"];
                document.getElementById("Answer2").value = flashCards["A2"];
                document.getElementById("Answer3").value = flashCards["A3"];
                document.getElementById("Answer4").value = flashCards["A4"];
                document.getElementById("Answer5").value = flashCards["A5"];
                document.getElementById("Answer6").value = flashCards["A6"];
                document.getElementById("Answer7").value = flashCards["A7"];
                document.getElementById("Answer8").value = flashCards["A8"];
                document.getElementById("Answer9").value = flashCards["A9"];

                isReady = true;
            }

            //Hover Effects
            WinJS.Utilities.query("#EditCards").listen("mouseover", function () {
                WinJS.Utilities.id("EditCards").setStyle("border-color", "#a183b8");
            });
            WinJS.Utilities.query("#EditCards").listen("mouseout", function () { WinJS.Utilities.id("EditCards").setStyle("border-color", "#481F67"); });
            WinJS.Utilities.query("#About").listen("mouseover", function () { WinJS.Utilities.id("About").setStyle("border-color", "#a183b8"); });
            WinJS.Utilities.query("#About").listen("mouseout", function () { WinJS.Utilities.id("About").setStyle("border-color", "#481F67"); });
            WinJS.Utilities.query("#Play").listen("mouseover", function () { WinJS.Utilities.id("Play").setStyle("border-color", "#a183b8"); });
            WinJS.Utilities.query("#Play").listen("mouseout", function () { WinJS.Utilities.id("Play").setStyle("border-color", "#481F67"); });

            //Edit Cards
            WinJS.Utilities.query("#EditCards").listen("mousedown", function () { WinJS.Utilities.id("EditCards").setStyle("border-style", "inset"); });
            WinJS.Utilities.query("#EditCards").listen("mouseup", function () {

            //Render Settings Page
            WinJS.Utilities.id("EditCards").clearStyle("border-style");
            WinJS.Utilities.id("HomePage").setStyle("display","none");
            WinJS.Utilities.id("SettingsPage").setStyle("display", "block");

            });

            //About
            WinJS.Utilities.query("#About").listen("mousedown", function () { WinJS.Utilities.id("About").setStyle("border-style", "inset"); });
            WinJS.Utilities.query("#About").listen("mouseup", function () {
                WinJS.Utilities.id("About").clearStyle("border-style");
                WinJS.Utilities.id("HomePage").setStyle("display", "none");
                WinJS.Utilities.id("AboutPage").setStyle("display", "block");

            });

            //Play
            WinJS.Utilities.query("#Play").listen("mousedown", function () { WinJS.Utilities.id("Play").setStyle("border-style", "inset"); });
            WinJS.Utilities.query("#Play").listen("mouseup", function () {
                WinJS.Utilities.id("Play").clearStyle("border-style");
                if (isReady) {
                    WinJS.Utilities.id("HomePage").setStyle("display", "none");
                    WinJS.Utilities.id("GamePage").setStyle("display", "block");

                    //Load first question
                    document.getElementById("GameBoard").innerHTML = document.getElementById("Question0").value;
                    WinJS.Utilities.id("GameBoard").setStyle("background-color", "#fff");
                    WinJS.Utilities.id("GameBoard").setStyle("color", "#000");

                    turn = 1;
                    side = 1;
                }
            });

            //Next Card
            WinJS.Utilities.query("#NextCard").listen("click", function () { 

                if (turn < 10) {
                    document.getElementById("GameBoard").innerHTML = document.getElementById("Question" + turn).value;
                }
                else {
                    turn = 0;
                    document.getElementById("GameBoard").innerHTML = document.getElementById("Question" + turn).value;
                }

                if (side == 2) {
                    side = 1;
                    WinJS.Utilities.id("GameBoard").setStyle("background-color", "#fff");
                    WinJS.Utilities.id("GameBoard").setStyle("color", "#000");
                }

                turn++;
            });

            //Flip Card
            WinJS.Utilities.query("#FlipCard").listen("click", function () {
                side = 2;

                var sideTurn = turn -1;

                WinJS.Utilities.id("GameBoard").setStyle("background-color", "#000");
                WinJS.Utilities.id("GameBoard").setStyle("color", "#fff");

                document.getElementById("GameBoard").innerHTML = document.getElementById("Answer" + sideTurn).value;
            });


            //Back Buttons
            WinJS.Utilities.query("#BackFromSettings").listen("click", function () {
                WinJS.Utilities.id("HomePage").clearStyle("display");
                WinJS.Utilities.id("HomePage").setStyle("display", "inherit");
                WinJS.Utilities.id("SettingsPage").setStyle("display", "none");
                WinJS.Utilities.id("AboutPage").setStyle("display", "none");
                WinJS.Utilities.id("GamePage").setStyle("display", "none");
            });
            WinJS.Utilities.query("#BackFromGame").listen("click", function () {
                WinJS.Utilities.id("HomePage").clearStyle("display");
                WinJS.Utilities.id("HomePage").setStyle("display", "inherit");
                WinJS.Utilities.id("SettingsPage").setStyle("display", "none");
                WinJS.Utilities.id("AboutPage").setStyle("display", "none");
                WinJS.Utilities.id("GamePage").setStyle("display", "none");
            });
            WinJS.Utilities.query("#BackFromAbout").listen("click", function () {
                WinJS.Utilities.id("HomePage").clearStyle("display");
                WinJS.Utilities.id("HomePage").setStyle("display", "inherit");
                WinJS.Utilities.id("SettingsPage").setStyle("display", "none");
                WinJS.Utilities.id("AboutPage").setStyle("display", "none");
                WinJS.Utilities.id("GamePage").setStyle("display", "none");
            });

            //Clear Settings
            WinJS.Utilities.query("#ClearAllFields").listen("click", function () {
                document.getElementById("Question0").value = "";
                document.getElementById("Question1").value = "";
                document.getElementById("Question2").value = "";
                document.getElementById("Question3").value = "";
                document.getElementById("Question4").value = "";
                document.getElementById("Question5").value = "";
                document.getElementById("Question6").value = "";
                document.getElementById("Question7").value = "";
                document.getElementById("Question8").value = "";
                document.getElementById("Question9").value = "";
                document.getElementById("Answer0").value = "";
                document.getElementById("Answer1").value = "";
                document.getElementById("Answer2").value = "";
                document.getElementById("Answer3").value = "";
                document.getElementById("Answer4").value = "";
                document.getElementById("Answer5").value = "";
                document.getElementById("Answer6").value = "";
                document.getElementById("Answer7").value = "";
                document.getElementById("Answer8").value = "";
                document.getElementById("Answer9").value = "";
            });

            //Save Settings
            WinJS.Utilities.query("#SaveSettings").listen("click", function () {

                var flashCards = new Windows.Storage.ApplicationDataCompositeValue();
                flashCards["Q0"] = document.getElementById("Question0").value;
                flashCards["Q1"] = document.getElementById("Question1").value;
                flashCards["Q2"] = document.getElementById("Question2").value;
                flashCards["Q3"] = document.getElementById("Question3").value;
                flashCards["Q4"] = document.getElementById("Question4").value;
                flashCards["Q5"] = document.getElementById("Question5").value;
                flashCards["Q6"] = document.getElementById("Question6").value;
                flashCards["Q7"] = document.getElementById("Question7").value;
                flashCards["Q8"] = document.getElementById("Question8").value;
                flashCards["Q9"] = document.getElementById("Question9").value;
                flashCards["A0"] = document.getElementById("Answer0").value;
                flashCards["A1"] = document.getElementById("Answer1").value;
                flashCards["A2"] = document.getElementById("Answer2").value;
                flashCards["A3"] = document.getElementById("Answer3").value;
                flashCards["A4"] = document.getElementById("Answer4").value;
                flashCards["A5"] = document.getElementById("Answer5").value;
                flashCards["A6"] = document.getElementById("Answer6").value;
                flashCards["A7"] = document.getElementById("Answer7").value;
                flashCards["A8"] = document.getElementById("Answer8").value;
                flashCards["A9"] = document.getElementById("Answer9").value;

                localSettings.values["flashCardsSettings"] = flashCards;

                isReady = true;

                //Render Home Page
                WinJS.Utilities.id("HomePage").clearStyle("display");
                WinJS.Utilities.id("HomePage").setStyle("display", "inherit");
                WinJS.Utilities.id("SettingsPage").setStyle("display", "none");
                WinJS.Utilities.id("AboutPage").setStyle("display", "none");
                WinJS.Utilities.id("GamePage").setStyle("display", "none");
            });

            WinJS.Utilities.query("#About").listen("mousedown", function () { WinJS.Utilities.id("About").setStyle("border-style", "inset"); });
            WinJS.Utilities.query("#About").listen("mouseup", function () { WinJS.Utilities.id("About").clearStyle("border-style"); });
            WinJS.Utilities.query("#Play").listen("mousedown", function () { WinJS.Utilities.id("Play").setStyle("border-style", "inset"); });
            WinJS.Utilities.query("#Play").listen("mouseup", function () { WinJS.Utilities.id("Play").clearStyle("border-style"); });

            WinJS.UI.processAll();
        }
    };

    app.start();
})();